<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>

<fmt:setBundle basename="ApplicationMessage" />
<fmt:setLocale value="zh_CN" />

<%@ include file="/WEB-INF/include/meta.jsp"%>
<%@ include file="/WEB-INF/include/css.jsp"%>
<link href="${ctx.resource}/css/select2.css" rel="stylesheet">
<link href="${ctx.resource}/css/select2-bootstrap.css" rel="stylesheet">
<title>服务商租约 - 租房宝金融管理平台</title>
</head>
<body>

	<%@ include file="/WEB-INF/include/header.jsp"%>

	<div class="web-g-main">

		<%@ include file="/WEB-INF/include/aside.jsp"%>
		<div class="content">
			<header class="header clearfix">
				<h3 class="pull-left">服务商租约</h3>
				<div class="btn-toolbar pull-right">
					<div class="btn-group">
						<a href="${ctx}/contracts/create"
							class="btn btn-default btn-shadow btn-shadow-default demo2do-btn"
							title="添加服务商租约"><i class="glyphicon glyphicon-plus"></i>&nbsp;&nbsp;添加服务商租约</a>
						<%-- <a href="${ctx}/contracts/search" class="btn btn-default btn-shadow btn-shadow-default demo2do-btn" data-target="#" data-toggle="modal" title="过滤查询"><i class="glyphicon glyphicon-search"></i>&nbsp;&nbsp;过滤查询</a> --%>
					</div>
				</div>
			</header>
			<form method="GET" action="${ctx}/contracts/search">
				<input type="hidden" name="filter" value="true">
				<div class="row">
					<div class="col-xs-3">
						<div class="input-group">
							<span class="input-group-addon">商户</span> <select name="app"
								class="form-control">
								<option value=""></option>
								<c:forEach var="item" items="${appList}">
									<option value="${item.id }"
										<c:if test="${item.id eq app }">selected</c:if>>${item.name }</option>
								</c:forEach>
							</select>
						</div>
					</div>
					<div class="col-xs-3">

						<div class="input-group pull-left">
							<span class="input-group-addon" id="basic-addon1">租约编号</span> <input
								type="text" class="form-control" name="contractNo"
								value="${contractNo}" placeholder="输入租约编号"
								aria-describedby="basic-addon1">
						</div>

					</div>

					<div class="col-xs-3">

						<div class="input-group pull-left">
							<span class="input-group-addon" id="basic-addon1">租客姓名</span> <input
								type="text" class="form-control" name="customerName"
								value="${customerName}" placeholder="输入租客姓名"
								aria-describedby="basic-addon1">
						</div>

					</div>
					<div class="col-xs-3">

						<div class="input-group pull-left">
							<span class="input-group-addon" id="basic-addon1">房源名称</span> <input
								type="text" class="form-control" name="community"
								value="${community}" placeholder="输入房源"
								aria-describedby="basic-addon1">
						</div>

					</div>

				</div>
				<div class="row" style="margin-top: 10px;">
					<div class="col-xs-3">

						<div class="input-group pull-left">
							<span class="input-group-addon" id="basic-addon1">房源地址</span> <input
								type="text" class="form-control" name="address"
								value="${address}" placeholder="输入房源地址"
								aria-describedby="basic-addon1">
						</div>

					</div>
					<div class="col-xs-2 pull-right">
						<div class="btn-group pull-right">
							<button
								class="btn btn-default btn-shadow btn-shadow-default demo2do-btn">
								<i class="glyphicon glyphicon-search"></i>&nbsp;&nbsp;查询
							</button>
						</div>

					</div>
				</div>
			</form>
			<form method="GET" action="${ctx}/contracts/contractAccount-search" style="margin-top:10px;">
				<input type="hidden" name="filter" value="true">
				<div class="row">
					<div class="col-xs-3">

						<div class="input-group pull-left">
							<span class="input-group-addon" id="basic-addon1">付款人姓名</span> <input
								type="text" class="form-control" name="payerName"
								value="${payerName}" placeholder="输入付款人姓名"
								aria-describedby="basic-addon1">
						</div>

					</div>
					<div class="col-xs-3">

						<div class="input-group pull-left">
							<span class="input-group-addon" id="basic-addon1">付款人卡号</span> <input
								type="text" class="form-control" name="payAcNo"
								value="${payAcNo}" placeholder="输入付款人卡号"
								aria-describedby="basic-addon1">
						</div>

					</div>
					<div class="col-xs-2 pull-right">
						<div class="btn-group pull-right">
							<button
								class="btn btn-default btn-shadow btn-shadow-default demo2do-btn">
								<i class="glyphicon glyphicon-search"></i>&nbsp;&nbsp;查询
							</button>
						</div>

					</div>
				</div>
			</form>

			<c:if test="${not empty infoMessage}">
				<div
					class="alert alert-success alert-dismissable alert-fade top-margin-10 text-align-center">
					<button type="button" class="close" data-dismiss="alert">&times;</button>
					<i class="glyphicon glyphicon-info-sign"></i>&nbsp;&nbsp;
					<fmt:message key="${infoMessage}" />
				</div>
			</c:if>

			<div class="table-area" style="margin-top: 10px;">
				<table class="data-list">
					<thead>
						<tr>
							<th>序号</th>
							<th>租约编号</th>
							<th style="max-width: 100px;">承租人</th>
							<th>租期</th>
							<th>租金</th>
							<th>收租人</th>
							<th>付款人</th>
							<th>付租方式</th>
							<th>状态</th>
							<th>操作</th>
						</tr>
					</thead>
					<tbody>
						<c:forEach var="contract" items="${contractList}"
							varStatus="status">
							<tr>
								<td>${status.index + 1}</td>
								<td><a href="${ctx}/contracts/${contract.id}/detail"
									class="hover-no-text-decoration">${contract.contractNo}</a></td>
								<td style="max-width: 100px;">
									<%-- <a href="${ctx}/renters/${contract.customer.id}/detail"> --%>${contract.customer.name}<!-- </a> -->
								</td>
								<td><fmt:formatDate value="${contract.beginDate}"
										pattern="yyyy-MM-dd" /><br> 至<br> <fmt:formatDate
										value="${contract.endDate}" pattern="yyyy-MM-dd" /></td>
								<td>${contract.monthFee}元/月</td>
								<td>${contract.app.name}</td>
								<td><c:forEach var="contractAccount"
										items="${data.getContractAccountsByContract(contract) }">
	                  		${contractAccount.payerName }<br />${contractAccount.payAcNo }
	                  	</c:forEach></td>
								<td><fmt:message key="${contract.paymentInstrument.key}" /></td>
								<td><fmt:message key="${contract.contractStatus.key}" /></td>
								<td><a href="${ctx}/contracts/${contract.id}/detail"
									class="hover-no-text-decoration" title="查看">查看</a> &nbsp;&nbsp;
								</td>
							</tr>
						</c:forEach>
					</tbody>
				</table>

				<c:choose>
					<c:when test="${not empty queryString}">
						<jsp:include page="/WEB-INF/include/page.jsp">
							<jsp:param name="url" value="contracts/search" />
							<jsp:param name="queryString" value="${queryString}" />
						</jsp:include>
					</c:when>
					<c:otherwise>
						<jsp:include page="/WEB-INF/include/page.jsp">
							<jsp:param value="contracts" name="url" />
						</jsp:include>
					</c:otherwise>
				</c:choose>

			</div>
			<%@ include file="/WEB-INF/include/footer.jsp"%>

		</div>

	</div>

	<%@ include file="/WEB-INF/include/script.jsp"%>
	<script src="${ctx.resource}/js/bootstrap-switch.min.js"></script>
	<script src="${ctx.resource}/js/bootstrap-modal-trigger.js"></script>
	<script src="${ctx.resource}/js/select2.min.js"></script>
	<script src="${ctx.resource}/js/select2_locale_zh-CN.js"></script>
	<script src="${ctx.resource}/js/bootstrap.validate.js"></script>
	<script src="${ctx.resource}/js/bootstrap.validate.en.js"></script>
	<script src="${ctx.resource}/js/earth-preupload.js"></script>
	<script src="${ctx.resource}/js/bootstrap-alert-fade-trigger.js"></script>

</body>
</html>
